<div class="li">
    <div class="hh">拖拽排序</div>
    代码来源自 https://sortablejs.github.io/Vue.Draggable
    <div class="mm">
        <div class="DraggableWrap">
            <div class="l">
                <Draggable class="list-group" tag="ul" v-model="list" ghostClass="ghost" :animation="200" :sort="false"
                    :group="{ name: 'people', pull: 'clone', put: false }">
                    <transition-group type="transition" :name="!drag ? 'flip-list' : null">
                        <li class="list-group-item" v-for="element in myDraggableArray" :key="element.order">
                            <i :class="
                                element.fixed ? 'fa fa-anchor' : 'glyphicon glyphicon-pushpin'
                              " @click="element.fixed = !element.fixed" aria-hidden="true"></i>
                            {{ element.name }}
                        </li>
                    </transition-group>
                </Draggable>
            </div>
            <div class="l">
                <Draggable class="list-group" tag="ul" v-model="list" ghostClass="ghost" :animation="200"
                    group="people">
                    <transition-group type="transition" :name="!drag ? 'flip-list' : null">
                        <li class="list-group-item" v-for="element in myDraggableArray" :key="element.order">
                            <i :class="
                                element.fixed ? 'fa fa-anchor' : 'glyphicon glyphicon-pushpin'
                              " @click="element.fixed = !element.fixed" aria-hidden="true"></i>
                            {{ element.name }}
                        </li>
                    </transition-group>
                </Draggable>
            </div>
        </div>
    </div>
</div>